import {
    Component,
    ElementRef,
    EventEmitter,
    Injector,
    Output,
    ViewChild,
} from "@angular/core";
import { AppComponentBase } from "@shared/common/app-component-base";
import {
    ParkingServiceProxy,
    ParkingDto,
    CreateParkingDto,
    UpdateParkingDto,
    ComboboxItemDto,
    GetParkingForEdtiOutput,
    ParkingEditDto,
} from "@shared/service-proxies/service-proxies";
import { ModalDirective } from "ngx-bootstrap";

import { finalize } from "rxjs/operators";

@Component({
    selector: "createOrEditParkingModal",
    templateUrl: "./create-or-edit-parking-modal.component.html",
})
export class CreateOrEditParkingModalComponent extends AppComponentBase {
    @ViewChild("createOrEditModal") modal: ModalDirective;

    @Output() modalSave: EventEmitter<any> = new EventEmitter<any>();

    active = false;
    saving = false;
    comboboxItem: ComboboxItemDto[] = [];
    getParkingForEdt: GetParkingForEdtiOutput;
    parkingEditDto: ParkingEditDto = new ParkingEditDto();

    id: number;
    emptyText: "";
    constructor(
        injector: Injector,
        private _parkingServiceProxy: ParkingServiceProxy
    ) {
        super(injector);
    }

    show(Id?: number): void {
        const self = this;
        self.active = true;
        self.id = Id;
        self._parkingServiceProxy.getParkingForEdit(Id).subscribe((result) => {
            self.comboboxItem = result.neighbourhoods;
            self.parkingEditDto = result.parkingEdit;
            console.log(self.parkingEditDto);
        });
        self.modal.show();
    }

    onShown(): void {}

    save(): void {
        const self = this;
        let name = "";
        let nid = "";
        this.comboboxItem.forEach((element) => {
            if (Number(element.value) == this.parkingEditDto.neighbourhood_id) {
                name = element.displayText;
            }
        });

        const input = new CreateParkingDto();
        input.neighbourhood_Name = name;

        input.parkingCode = this.parkingEditDto.parkingCode;
        input.parkingName = this.parkingEditDto.parkingName;

        input.neighbourhood_id = this.parkingEditDto.neighbourhood_id;

        console.log(input.neighbourhood_id);
        this.saving = true;
        if (this.id == null) {
            this._parkingServiceProxy
                .create(input)
                .pipe(finalize(() => (this.saving = false)))
                .subscribe(() => {
                    this.notify.info(this.l("SavedSuccessfully"));
                    this.close();
                    this.modalSave.emit(null);
                });
        } else {
            input.id = this.parkingEditDto.id;
            this._parkingServiceProxy
                .update(input)
                .pipe(finalize(() => (this.saving = false)))
                .subscribe(() => {
                    this.notify.info(this.l("SavedSuccessfully"));
                    this.close();
                    this.modalSave.emit(null);
                });
        }
    }

    close(): void {
        this.active = false;
        this.modal.hide();
    }
}
